<template>
  <view>
    <m-top :autoBack="true" :bgChangeByScroll="true" bgColor="#8C82FF" @getHeight="getGlHeight"> 我的预约 </m-top>

    <m-container :top="glTop">
      <view class="mgt32 pdv40">
        <template v-if="list.length > 0">
          <view class="book-item" v-for="(item, index) in list" :key="index">
            <panel-title :showMore="true" moreTheme="icon">
              {{ item.tmi_name }}
            </panel-title>

            <view class="mgt40">
              <m-bbs :options="item.item || []"></m-bbs>
            </view>
          </view>
        </template>

        <view v-else style="padding: 40rpx 0">
          <m-empty></m-empty>
        </view>

        <!-- <view class="mgt40">
          <panel-title :showMore="true" moreTheme="icon">技术大会 </panel-title>
        </view>
        <view class="mgt40">
          <m-bbs></m-bbs>
        </view> -->
      </view>
    </m-container>
  </view>
</template>

<script>
import GlTopMixin from "@/mixins/global-top";
import PanelTitle from "@/pages/index/components/title.vue";
import { getMyOrderApi } from "@/api/modules/mine.js";

export default {
  mixins: [GlTopMixin],
  components: { PanelTitle },
  data() {
    return {
      list: [],
    };
  },

  async onLoad() {
    uni.showLoading({
      title: "加载中",
    });
    try {
      const response = await getMyOrderApi();
      console.log(response);
      this.list = response;
    } catch (error) {}
    uni.hideLoading();
  },
};
</script>

<style lang="scss" scoped>
.guest-box {
  &__swiper {
    padding-left: 40rpx;
  }

  &-main {
    width: fit-content;
    padding-right: 40rpx;

    image {
      width: 80rpx;
      height: 80rpx;

      &:not(:first-child) {
        margin-left: 20rpx;
      }
    }
  }
}

.book-item {
  &:not(:first-child) {
    margin-top: 40rpx;
  }
}
</style>
